<!doctype html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!--<title>Document</title>-->
    <link rel="stylesheet" href="/static/app/lib/iconfont/iconfont.css">
    <link rel="stylesheet" href="/static/app/css/style.css">
    <script src="/static/app/lib/zy.rem.js"></script>
    <script src="/static/app/lib/jquery1.12.3.min.js"></script>
    <script src="/static/app/js/base.js"></script>
    <link rel="stylesheet" href="/static/app/css/login.css">
    <script src="/static/layer/layer.min.js"></script>
    <style>
        .code{
            position:relative;
        }
        .code button{
            position:absolute;
            font-size: .20rem;
            width: 25%;
            left: 74%;
            top: -5%;
        }
    </style>
</head>
<body>
<div class="center">
    <div class="logos" id="logos">
        <img class="logo_app" src="/static/app/img/app_logo2.png"/>
        <span class="logo_font">北斗•定位</span>
    </div>
    <form  class="login-from" method="post" id="form" form="submit">
        <div class="login-container">
            <input placeholder="请输入手机号码" type="text" name="mobile">
            <input  type="hidden" name="for_pw">
        </div>
        <div class="login-container code">
            <input placeholder="手机验证码" type="text" name="code">
            <button type="button" class="am-btn am-btn-primary" onclick="btnCheck(this)">发送验证码</button>
            <button type="button" class="am-btn am-btn-primary yfs" style="display: none">
                已发送
            </button>
        </div>
        <div class="login-container">
            <input placeholder="请输入新密码" type="password" name="password">
        </div>
        <div class="login-container">
            <input placeholder="请确认密码" type="password" name="password2">
        </div>
        <div class="login-container">
            <button type="submit">确认更改</button>
            <div class="reg">
                <a href="{:url('index')}">想起密码,去登陆</a>
            </div>
        </div>
    </form>
</div>
</body>
{include file='public:validation'}
<script>
    //提交
    function roleSubmit(){
        if($('[name="phone"]').val() == '' ){
            layer.alert('请输入手机号码', {icon: 2});
            return false;
        }
        var form=document.getElementById("form");
        var formData=new FormData(form);

        $.ajax({
            url:"{:Url('Login/forData')}",
            type:'POST',
            data:formData,
            async: false,
            cache: false,
            contentType: false, //不设置内容类型
            processData: false, //不处理数据
            success:function(res){
                if (res.code != 200) {
                    layer.msg(res.msg, {shade: 0.5, time: 1000,icon: 2});
                    return false;
                }
               layer.msg(res.msg, {shade: 0.5, time: 800, icon: 1}, function(){
                   window.location.href="{:url('index')}";
               });
            }
        });
    }

    /**
     * [btnCheck 按钮倒计时常用于获取手机短信验证码]
     */
    function btnCheck(t) {
        // $t=$(t).prop("outerHTML");
        // console.log($t);
        $mobile = $('[name="mobile"]').val();
        if ($mobile.length ==11){
            $.ajax({
                type : 'post',
                url : "{:url('vercod')}",
                data : {
                    'mobile':$mobile,
                    'for_pw':'1'
                },
                success : function(res){
                    if (res.code != 200) {
                        layer.msg(res.msg,{shade: 0.5, time: 2000, icon: 2});
                        return false;
                    }
                    layer.msg(res.msg, {shade: 0.5, time: 2000, icon: 1}, function(){
                        // $(this).addClass("on");
                        var time = 60;
                        $(t).hide();
                        $('.yfs').show();

                        var timer = setInterval(function() {
                            if (time == 0) {
                                clearInterval(timer);
                                $('.yfs').hide();
                                $(t).show();
                            } else {
                                $('.yfs').text(time+"秒");
                                time--;
                            }
                        }, 1000);
                    });

                }
            })
        }else{
            layer.msg('请输入11位手机号',{shade: 0.5, time: 2000, icon: 2});
        }

    }
</script>
</html>